<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <ol>
        <li>111</li>
        <li>222</li>

        <script>
            //创建li元素
            const liObj = document.createElement("li")
            // console.log(liObj)
            //把创建的li元素添加到ol元素中
            const olObj = document.querySelector("ol")
            // console.log(olObj)
            
            //创建文本节点
            const textObj = document.createTextNode('333')
            liObj.appendChild(textObj)
            // console.log(liObj)

            //创建一个属性节点
            const attrNode = document.createAttribute("id")
            // liObj.appendChild(attrNode)
            // liObj.setAttribute(attrNode,"3")     //这样写不可以
            attrNode.value = '3';
            liObj.setAttribute("name","33333")
            liObj.setAttributeNode(attrNode)
            // console.log(liObj)

            olObj.appendChild(liObj)
            console.log(olObj)
            console.log(attrNode.nodeType)
        </script>
    </ol>
</body>

</html>